<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>导航添加</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="format-detection" content="telephone=no">
  <link rel="stylesheet" href="${s.base}/js/layui/css/layui.css" media="all" />
  <link rel="stylesheet" href="${s.base}/css/base/base.css" media="all" />
  <style type="text/css">
    .site-doc-icon li{
      display: inline-block;
      vertical-align: middle;
      width: 127px;
      line-height: 25px;
      padding: 20px 0;
      margin-right: -1px;
      margin-bottom: -1px;
      border: 1px solid #e2e2e2;
      font-size: 14px;
      text-align: center;
      color: #666;
      transition: all .3s;
      -webkit-transition: all .3s;
    }
  </style>
</head>
<body class="childrenBody">
<form class="layui-form" style="width:80%;">
  <input type="hidden" class="form-control id" id="useType" name="useType" value="${useType}" />
  <input type="hidden" class="form-control id" id="id" name="id" value="${webNavigation.id}" />
  <input type="hidden" class="form-control parentId" id="parentId" name="parentId" value="${webNavigation.parentId}" />
  <div class="layui-form-item layui-row layui-col-xs12">
    <label class="layui-form-label">父类导航</label>
    <div class="layui-input-block">
      <input type="text" class="layui-input" value="${webNavigation.parentName!'无'}" maxlength="20" readonly />
    </div>
  </div>
  <div class="layui-form-item layui-row layui-col-xs12">
    <label class="layui-form-label">导航名称</label>
    <div class="layui-input-block">
      <input type="text" class="layui-input name"  id="name" name="name" value="${webNavigation.name}" maxlength="20" lay-verify="required" placeholder="请输入导航名称">
    </div>
  </div>
  <div class="layui-form-item layui-row layui-col-xs12">
    <label class="layui-form-label">导航类型</label>
    <div class="layui-input-block">
      <select class="form-control"  lay-filter="type" name="type" lay-verify="required" id="type">
        <option value="1" <#if webNavigation.type=="1">selected</#if> >目录</option>
        <option value="2" <#if webNavigation.type=="2">selected</#if> >菜单</option>
      </select>
    </div>
  </div>
  <div id="urlSelect" <#if webNavigation.type!="2"> style="display: none;"</#if> class="layui-form-item layui-row layui-col-xs12">
    <label class="layui-form-label">导航连接</label>
    <div class="layui-input-block">
      <input type="text" class="layui-input url" id="url" name="url" value="${webNavigation.url}"  maxlength="200" placeholder="请输入导航连接">
    </div>
  </div>
  <div id="pictureSelect"  class="layui-form-item layui-row layui-col-xs12" <#if webNavigation.type!="1"> style="display: none;"</#if>>
    <label class="layui-form-label">图片</label>
    <div class="layui-input-block">
      <div class="famous-upload-pic">
        <img  <#if webNavigation.picture?if_exists  >src="${webNavigation.picture}"<#else>src="${s.base}/image/icon_addpic.png"</#if> class="upload-avatar" id="upload-avatar"/>
        <input type="file" name="myfiles" class="upload" id="myFile" onchange="ajaxFileUploads('myFile','picture','upload-avatar')">
        <input type="hidden" class="image" name="picture" id="picture" <#if webNavigation.picture?if_exists  > value="${webNavigation.picture}"  <#else> value="/image/icon_addpic.png" </#if> />
      </div>
    </div>
  </div>
  <div class="layui-form-item layui-row layui-col-xs12">
    <label class="layui-form-label">排序号</label>
    <div class="layui-input-block">
      <input type="text" class="layui-input sort"  maxlength="5" id="sort" name="sort" value="${webNavigation.sort}" placeholder="请输入排序号，越大越往前" lay-verify="sortber">
    </div>
  </div>
  <div class="layui-form-item layui-row layui-col-xs12">
    <div class="layui-input-block">
      <button class="layui-btn layui-btn-sm" lay-submit="" lay-filter="btnSubmit">确定</button>
      <button type="reset" class="layui-btn layui-btn-sm layui-btn-primary closeLay">取消</button>
    </div>
  </div>
</form>
<ul class="site-doc-icon icons layui-row">
</ul>

<script type="text/javascript" src="${s.base}/js/layui/layui.js"></script>
<script type="text/javascript" src="${s.base}/js/base/jquery-3.2.0.min.js"></script>
<script type="text/javascript" src="${s.base}/js/base/ajaxfileupload.js"></script>
<script type="text/javascript">
    layui.use(['form','layer'],function(){
        var form = layui.form
        layer = parent.layer === undefined ? layui.layer : top.layer,
            $ = layui.jquery;
        //监听下拉框
        form.on('select(type)', function(data){
            //1、目录，2、菜单
            if("2"==data.value){
                $("#urlSelect").show();
                $("#pictureSelect").hide();
            }else{
                $("#urlSelect").hide();
                $("#pictureSelect").show();
            }
        });

        form.on("submit(btnSubmit)",function(data){


            //弹出loading
            var index = top.layer.msg('数据提交中，请稍候',{icon: 16,time:false,shade:0.8});
            // 实际使用时的提交信息
            $.post("/webNavigation/updateOrAddEntity",data.field,function(result){
                if(1==result.returnInfo.state){
                    top.layer.close(index);
                    top.layer.msg("操作成功！");
                    layer.closeAll("iframe");
                    //刷新父页面
                    parent.location.reload();
                }else{
                    top.layer.msg(result.returnInfo.errorMsg);
                }
            },"json")
            return false;
        });
        $("#signBtn").click(function(){
            var str="";
            var sort=1;
            $("#sign ul li").each(function (index,obj) {
                if(sort!=1){
                    str+=',';
                }
                str+='{"sort": '+sort+',"icon": "'+$(obj).find(".code").html().replace("amp;","")+'","sign": "'+$(obj).find(".code").html()+'", "name": "'+$(obj).find(".name").html()+'"}';
                sort++;
            });
            $("#signs").val(str);
        })
    })</script>
</body>
</html>